<template>
  <div class="searchIssue">
    <!-- 头部搜索部分 -->
    <myHeader />
    <el-card class="box-card">
      <el-row>
        <dynTable
          ref="dynTable"
          :loading="tableLoading"
          :table-data="tableData"
          :table-columns="tableColumns"
        />
        <!--分页组件-->
        <pagination
          :total="total"
          :page.sync="listQuery.page"
          :limit.sync="listQuery.size"
          @pagination="getList"
        />
      </el-row>
    </el-card>
    <!-- 弹窗组件 -->
    <myDialog ref="myDialog" :form="form" />
  </div>
</template>
<script>

import myHeader from './components/header'
import myDialog from './components/Dialog'
import mySetting from '@/mixins/mySetting'
export default {
  name: 'RepairHistory',
  components: {
    myHeader,
    myDialog
  },
  mixins: [mySetting],
  data() {
    return {
      tableData: [],
      form: {},
      tableColumns: [
        { prop: '', label: this.$t('index'), type: 'index', width: '50px', templete: (_scope) => {
          return (
            <span>{ (this.listQuery.page - 1) * this.listQuery.size + _scope.$index + 1 }</span>
          )
        } },
        {
          prop: 'Handle',
          label: this.$t('handlerId')
        },
        {
          prop: 'LotID',
          label: this.$t('testerId')
        },
        {
          prop: 'CLOSED_FLAG',
          label: this.$t('closeFlag'),
          templete: (_scope) => {
            return (
              <el-switch
                v-model={_scope.row.CLOSED_FLAG}
                active-value={1}
                inactive-value={0}
                active-color={'#13ce66'}
                inactive-color={'#ff4949'}
                disabled/>
            )
          }
        },
        {
          prop: 'IssueGroup',
          label: this.$t('issueGroup')
        },
        {
          prop: 'ISSUE_DESC',
          label: this.$t('issueDesc')
        },
        { prop: '', label: this.$t('details'), templete: (_scope) => {
          return (
            <el-link
              underline={false}
              type='primary'
              on-click={() => this.handleClick(_scope.row)}
            >{ this.$t('details') }</el-link>
          )
        } }
      ],
      tableLoading: true
    }
  },
  created() {
    this.tableLoading = false
  },
  methods: {
    handleClick(row) {
      this.$refs.myDialog.openDialog()
    },
    // 切换分页
    getList(val) {
      console.log(val)
    }
  }
}
</script>
<style lang="scss" scoped>
@import "~@/assets/styles/defaultStyle.scss";
</style>
